
.header{
	width: 100%;
	height: 461rpx;
	background-image: url('https://wxapp-normal.oss-accelerate.aliyuncs.com/api/image/banner2.png');
	background-size: 100% 100%;
	padding-top:211rpx;
	box-sizing: border-box;
	.userInfoBox{
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 690rpx;
		margin: 0 auto;
		font-size: 32rpx;
		font-weight: bold;
		.infoBoxLeft{
			display: flex;
			align-items: center;
			white-space: nowrap;
			>view{
				display: flex;
				margin-left: 20rpx;
				flex-direction: column;
				>p:nth-child(2){
					color: #666666;
					font-size: 24rpx;
					margin-top: 12rpx;
				}
				>p:nth-child(1){
					display: flex;
					align-items: center;
					>text:nth-child(1){
						max-width: 200rpx;
						@include clampSty(1)
					}
					>text:nth-child(2){
						padding: 8rpx 20rpx;
						border-radius: 30rpx;
						color: #fff;
						font-size: 24rpx;
						margin-left: 20rpx;
						background-image:linear-gradient(to right,#7ba9fd,#1163f0) ;
					}
				}
			}
		}
		>p{
			width: 140rpx;
			height: 60rpx;
			background: #FFFFFF;
			box-shadow: 0rpx 2rpx 4rpx 1rpx rgba(0,0,0,0.03);
			border-radius: 40rpx;
			text-align: center;
			line-height: 60rpx;
			color: #4E72FA;
			font-size: 24rpx;
		}
	}
}
.poster{
	width: 690rpx;
	height: 145rpx;
	background: linear-gradient( 90deg, #3D4D55 0%, #161D20 100%);
	border-radius: 28rpx 28rpx 28rpx 28rpx;
	margin:0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 38rpx 30rpx;
	box-sizing: border-box;
	position: relative;
	z-index: 2;
	margin-top: -100rpx;
	>view:nth-child(1){
		>p{
			display: flex;
			align-items: center;
			color: #D1AA64;
			margin-bottom: 6rpx;
			font-size: 28rpx;
			font-weight: bold;
			>image{
				width: 33rpx;
				height: 26rpx;
				margin-right: 9rpx;
			}
		}
		>text{
			color: #88959E;
			font-size: 24rpx;
		}
	}
	>view:nth-child(2){
		width: 202rpx;
		height: 68rpx;
		background: linear-gradient( 90deg, #D1AA64 0%, #FFDEAA 100%);
		border-radius: 34rpx 34rpx 34rpx 34rpx;
		text-align: center;
		line-height: 68rpx;
		color: #3D332A;
		font-size: 28rpx;
		font-weight: bold;
	}
	
}
.serviceBox{
	width: 690rpx;
	border-radius: 10rpx;
	background-color: #fff;
	box-sizing: border-box;
	margin: 0 auto;
	color: #333;
	display: grid;
	grid-template-columns: repeat(3, 1fr); /* 一行三个项目 */
	gap: 30rpx; 
	font-size: 24rpx;
	flex-wrap: wrap;
	margin: 0 auto;
	margin-top: 46rpx;
		.item{
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			width: 210rpx;
			height: 210rpx;
			color: #737373;
			>image{
				width: 80rpx;
				height: 80rpx;
				margin-bottom: 8rpx;
			}
		}
}
.codeBox{
	width: 690rpx;
	background-color: #fff;
	padding: 50rpx 30rpx;
	border-radius: 10rpx;
	font-size: 28rpx;
	box-sizing: border-box;
	.codeTitle{
		font-weight: bold;
		font-size: 32rpx;
		text-align: center;
		margin-bottom: 50rpx;
	}
	.inputItem{
		display: flex;
		align-items: center;
		margin-bottom: 30rpx;
		white-space: nowrap;
		>text{
			font-weight: bold;
		}
		>input,>view{
			flex: 1;
			height: 80rpx;
			border:1rpx solid #EDEDED;
			border-radius: 50rpx;
			padding:0 20rpx;
			box-sizing: border-box;
		}
		>view{
			display: flex;
			align-items: center;
			>text{
				font-size: 26rpx;
				color: deepskyblue;
				font-weight: bold;
			}
		}
	}
	.btnItem{
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 600rpx;
		margin: 0 auto;
		margin-top: 50rpx;
		>text:nth-child(1){
			background-color: #DFDFE1;
		}
		>text{
			width: 250rpx;
			line-height: 90rpx;
			border-radius: 50rpx;
			color: #fff;
			text-align: center;
			font-weight: bold;
			background-color: deepskyblue;
			letter-spacing: 8rpx;
		}
	}
}